<template>
  <div
    class="fot-box h-200 flex-a pad-l240"
    :style="{
      background: `url(${getAssetsImages('fot-bg')}) no-repeat`,
      'background-size': '100%',
    }"
  >
    <div class="fot-item">
      <div class="fot-txt">
        知产宝致力于以最“安全快捷”的方式，让每一个企业都能高效并且安全的办理各类知识产权业务
      </div>
      <div class="fot-detail-btn mar-t24">了解详情</div>
    </div>
  </div>
</template>

<script setup>
/**
 * 了解详情组件
*/
const getAssetsImages = name => {
  return new URL(`/src/assets/serviceImgs/${name}.png`, import.meta.url).href;
};
</script>

<style lang="scss" scoped>
.fot-box {
  .fot-txt {
    font-size: 20px;
    font-family: PingFang SC, PingFang SC-Regular;
    font-weight: Regular;
    text-align: left;
    color: #ffffff;
  }
  .fot-detail-btn {
    width: 130px;
    height: 40px;
    border: 1px solid #ffffff;
    border-radius: 2px;
    font-size: 16px;
    font-family: PingFang TC, PingFang TC-Regular;
    font-weight: Regular;
    text-align: left;
    color: #ffffff;
    text-align: center;
    line-height: 40px;
  }
}
</style>
